<!DOCTYPE html>
<html lang="zh-CN">
<head>
    <title>搞钱联盟</title>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <!-- jquery -->
    <script src="/utils/jquery2.2.3/jquery.min.js"></script>
    <!-- 引入layui -->
    <link href="/utils/layui-2.8.17/css/layui.css" rel="stylesheet">
    <script src="/utils/layui-2.8.17/layui.js"></script>
    <!-- 引入bootstrap -->
    <link href="/utils/twitter-bootstrap-5.3.3/css/bootstrap.min.css" rel="stylesheet">
    <!--引入自定义css-->
    <link href="/css/common.css" rel="stylesheet" type="text/css">
</head>
<body>
<div class="container-fluid" style="background-color: gray">
    <!--标题-->
    <div class="row mx-1 my-1">
        <div class="col-sm-12 mb-3">
            <span class="h3">成本计算器</span>
        </div>
    </div>
    <!--汇率相关-->
    <div class="col-sm-9 input-group-border">
        <div class="row mx-1 my-1">
            <!-- 付款币种 -->
            <div class="col-sm-6">
                <div class="form-group row align-items-center">
                    <label for="payCurrency" class="col-sm-4 col-form-label text-sm-right">付款币种</label>
                    <div class="col-sm-8">
                        <select id="payCurrency" data-name="currency" class="form-control selectpicker"></select>
                    </div>
                </div>
            </div>
            <!-- 基础币种 -->
            <div class="col-sm-6">
                <div class="form-group row align-items-center">
                    <label for="baseCurrency" class="col-sm-4 col-form-label text-sm-right">基础币种</label>
                    <div class="col-sm-8">
                        <select id="baseCurrency" data-name="currency" class="form-control selectpicker"></select>
                    </div>
                </div>
            </div>
        </div>
        <!-- 汇率部分 -->
        <div class="row mx-1 my-1">
            <div class="col-sm-12 d-flex align-items-center">
                <label for="exchangeRateBox" class="col-sm-2 col-form-label text-sm-right mr-2">汇率</label>
                <div id="exchangeRateBox" class="d-flex justify-content-start align-items-center flex-grow-1">
                    <span class="mx-1 my-1">1</span>
                    <span class="mx-1 my-1" name="payCurrency">付款币种</span>
                    <span class="mx-1 my-1">=</span>
                    <input type="text" id="exchangeRate" class="form-control mx-1 my-1" style="width: 100px;">
                    <span class="mx-1 my-1" name="baseCurrency">基础币种</span>
                </div>
            </div>
        </div>
    </div>
    <!--计算的商品列表-->
    <div class="col-sm-9 my-2 input-group-border">
        <table class="my-1 table table-bordered" id="productCostTable">
            <thead>
            <tr>
                <th style="text-align:center" data-name="productName">商品名称</th>
                <th style="text-align:center" data-name="num">数量</th>
                <th style="text-align:center" data-name="productPayPrice">商品单价(付)</th>
                <th style="text-align:center" data-name="productTotalPayPrice">商品总价(付)</th>
                <th style="text-align:center" data-name="costPayPrice">成本单价(付)</th>
                <th style="text-align:center" data-name="costTotalPayPrice">成本总价(付)</th>
                <th style="text-align:center" data-name="productBasePrice">商品单价(基)</th>
                <th style="text-align:center" data-name="productTotalBasePrice">商品总价(基)</th>
                <th style="text-align:center" data-name="costBasePrice">成本单价(基)</th>
                <th style="text-align:center" data-name="costTotalBasePrice">成本总价(基)</th>
            </tr>
            </thead>
            <tbody id="productCostTBody">
            </tbody>
        </table>
        <div class="row">
            <div class="col-sm-4">
                <button id="addOneTr" class="btn btn-info mx-1 my-1">添加一行</button>
            </div>
        </div>
    </div>
    <!--费用汇总-->
    <div class="col-sm-9 my-2 input-group-border">
        <!-- 总数量 -->
        <div class="row mx-1 my-1 col-sm-6 form-group align-items-center">
            <label for="sumNum" class="col-sm-4 col-form-label text-sm-right">商品总数量</label>
            <div class="col-sm-8">
                <span id="sumNum"></span>
            </div>
        </div>
        <!-- 商品总价-->
        <div class="row mx-1 my-1 col-sm-6 form-group align-items-center">
            <label for="sumProductPayPrice" class="col-sm-4 col-form-label text-sm-right">订单商品总价(付)</label>
            <div class="col-sm-8">
                <span id="sumProductPayPrice">0</span>
                <span class="mx-1 my-1" name="payCurrency">付款币种</span>
                <span class="mx-1 my-1">=</span>
                <span id="sumProductBasePrice">0</span>
                <span class="mx-1 my-1" name="baseCurrency">基础币种</span>
            </div>
        </div>
        <!-- 优惠总额-->
        <div class="row mx-1 my-1 col-sm-6 form-group align-items-center">
            <label for="discountPayPrice" class="col-sm-4 col-form-label text-sm-right">优惠总额</label>
            <div class="col-sm-8 d-flex align-items-center">
                <input type="text" id="discountPayPrice" class="form-control mx-1 my-1" value="0">
                <span class="mx-1 my-1 no-wrap-text" name="payCurrency">付款币种</span>
                <span class="mx-1 my-1">=</span>
                <span id="discountBasePrice">0</span>
                <span class="mx-1 my-1 no-wrap-text" name="baseCurrency">基础币种</span>
            </div>
        </div>
        <!-- 运费-->
        <div class="row mx-1 my-1 col-sm-6 form-group align-items-center">
            <label for="shippingPayPrice" class="col-sm-4 col-form-label text-sm-right">运费</label>
            <div class="col-sm-8 d-flex align-items-center">
                <input type="text" id="shippingPayPrice" class="form-control mx-1 my-1" value="0">
                <span class="mx-1 my-1 no-wrap-text" name="payCurrency">付款币种</span>
                <span class="mx-1 my-1">=</span>
                <span id="shippingBasePrice">0</span>
                <span class="mx-1 my-1 no-wrap-text" name="baseCurrency">基础币种</span>
            </div>
        </div>
<!--        &lt;!&ndash; 提货费&ndash;&gt;-->
<!--        <div class="row mx-1 my-1 col-sm-6 form-group align-items-center">-->
<!--            <label for="pickupExchangeRate" class="col-sm-4 col-form-label text-sm-right">提货费</label>-->
<!--            <div class="col-sm-8 d-flex align-items-center">-->
<!--                <span class="mx-1 my-1" id="pickupExchangeRate"></span>-->
<!--                <input type="text" id="pickupPayPrice" class="form-control mx-1 my-1" value="0">-->
<!--                <select id="shippingPayCurrency" data-name="currency" class="form-control selectpicker"></select>-->
<!--                <span class="mx-1 my-1 no-wrap-text">=</span>-->
<!--                <span id="pickupBasePrice">0</span>-->
<!--                <span class="mx-1 my-1 no-wrap-text" name="baseCurrency">基础币种</span>-->
<!--            </div>-->
<!--        </div>-->
<!--        &lt;!&ndash; 其他费用&ndash;&gt;-->
<!--        <div class="row mx-1 my-1 col-sm-6 form-group align-items-center">-->
<!--            <label for="otherExchangeRate" class="col-sm-4 col-form-label text-sm-right">其他费用</label>-->
<!--            <div class="col-sm-8 d-flex align-items-center">-->
<!--                <span class="mx-1 my-1" id="otherExchangeRate"></span>-->
<!--                <input type="text" id="otherPayPrice" class="form-control mx-1 my-1" value="0">-->
<!--                <select id="otherPayCurrency" data-name="currency" class="form-control selectpicker"></select>-->
<!--                <span class="mx-1 my-1 no-wrap-text">=</span>-->
<!--                <span id="otherBasePrice">0</span>-->
<!--                <span class="mx-1 my-1 no-wrap-text" name="baseCurrency">基础币种</span>-->
<!--            </div>-->
<!--        </div>-->
        <!-- 总成本-->
        <div class="row mx-1 my-1 col-sm-6 form-group align-items-center">
            <label for="sumCostPayPrice" class="col-sm-4 col-form-label text-sm-right">订单总成本(付)</label>
            <div class="col-sm-8 d-flex align-items-center">
                <span id="sumCostPayPrice">0</span>
                <span class="mx-1 my-1 no-wrap-text" name="payCurrency">付款币种</span>
                <span class="mx-1 my-1">=</span>
                <span id="sumCostBasePrice">0</span>
                <span class="mx-1 my-1 no-wrap-text" name="baseCurrency">基础币种</span>
            </div>
        </div>
    </div>
    <!--操作说明-->
    <div class="col-sm-6 mt-5" style="background-color: yellow ;color:red">
        <h1>操作步骤</h1>
        <ol>
            <li>1.双击 启动工具包.bat</li>
            <li>2.弹出黑色框，不要关闭这个框</li>
            <li>3.访问网页，http://localhost:8080/</li>
            <li>4.维护“店铺列表”的表格</li>
            <li>5.维护“快递列表”的表格</li>
            <li>6.选择店铺，快递和日期</li>
            <li>======</li>
            <li>7.在美团，导出所有代发货的订单到“1.美团导出”</li>
            <li>8.点击“1.美团导出 -> 2.传美导入”，生成“传美导入文件”</li>
            <li>9.在传美，导入“2.传美导入”中的文件</li>
            <li>10.在传美打印后，导出到“3.传美导出”</li>
            <li>11.点击”3.传美导出 -> 4.美团导入&5.揽收文件”</li>
            <li>12.在美团，导入发货文件“4.美团导入</li>
            <li>13.将“5.揽收文件”发送到微信群做揽收</li>
        </ol>
    </div>
</div>
<!-- 引入公用JS -->
<script src="/js/common.js"></script>
<!-- 引入自定义JS -->
<script src="/js/costCalculation.js"></script>
</body>
</html>